<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<meta charset="utf-8" />
	<title></title>
	<link href="../css/bootstrap.min.css" rel="stylesheet">
	<link href="../css/bootstrap-select.css" rel="stylesheet">
    <link rel="stylesheet" href="../css/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="../css/bootstrap-treeview.min.css">
	<link href="../css/font-awesome.min.css" rel="stylesheet">
	<link href="../css/JyyCommon.css" rel="stylesheet">
	<link href="../css/JyyTable.css" rel="stylesheet">
	<link href="../css/JyyTree.css" rel="stylesheet">
	<link href="../css/JyyMsgBox.css" rel="stylesheet">
	<script type="text/javascript" src="../js/jquery-3.2.1.js"></script>
	<script type="text/javascript" src="../js/jquery.form.min.js"></script> 
	<script type="text/javascript" src="../js/jquery-ui.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap-datetimepicker.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap-paginator.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap-treeview.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap-select.js"></script>
	<script type="text/javascript" src="../js/jyy_modal.js"></script>
	<script type="text/javascript" src="../js/JyyCommon.js"></script>
	<script type="text/javascript" src="../js/JyyTable.js"></script>
	<script type="text/javascript" src="../js/JyyTree.js"></script>
	<script type="text/javascript" src="../js/JyyMsgBox.js"></script>
	<script type="text/javascript" src="../js/JyyLoading.js"></script>
	<style>
	.heidenbt{
		display: none
	}
</style>
	<script type="text/javascript">
		var tree = null;
		var table = null;
		var scheme = null;
		var treeCode = null;
		var planId ='';
		$(function(){
			
			planTree()
			itemTree();
		});
		function planTree(){
			
			var data1 = getTreeDatas();
			 
			function buildDomTree() {
				var data = [];
				function walk(nodes, data) {
					if (!nodes) {
						return;
					}
					$.each(nodes, function(id, node) {
						var obj = {
							id : node.code,
							text : node.name
						};
						if (node.isLeaf == true) {
							obj.nodes = [];
							walk(node.items, obj.nodes);
						}
						data.push(obj);
					});
				}
	 
				walk(data1, data);
				return data;
			}
	 
				$('#knowledgeTree').treeview({
                    data: buildDomTree(),
                    showCheckbox: true,
                    onNodeChecked: function (event, data) {
                    	if(data.selectable&&data.nodes==undefined){
	                        var str = $("#knowledgeText").val();
	                        if (str.length > 0) {
	                        	planId = planId+data.id + ','
	                        	if(str.indexOf(data.text)==-1){
		                            $("#knowledgeText").val(str + ',' +data.text);
	                        	}
	                        } else {
	                        	planId = planId+data.id + ','
	                            $("#knowledgeText").val(data.text);
	                        }
                    	}
                    },
                    onNodeUnchecked: function (event, node) {
						if(node.selectable&&node.nodes==undefined){
    			        	var str = $("#knowledgeText").val();
    		                if (str.length > 0) {
    		                	if(str.indexOf(node.text)!=-1){
    		                		//str = str.replace((node.text+','),'');
    		                		planId = resListString(planId,node.id)+',';
    			                    $("#knowledgeText").val(resListString(str,node.text));
    		                	}
    		                } else {
    		                    $("#knowledgeText").val('');
    		                }
    		        	}
                    }
                });
				$("#dateID").datetimepicker({
					format : 'yyyy', // 展现格式
					startDate : "2000",// 开始时间
					endDate : "2025", // 结束时间
					autoclose : true, // 选择日期后关闭
					startView : 4,
					minView : 4,
					language : 'zh-CN', //显示语言为中文
				});
		}
		function itemTree(){
			var treeData = [{
	            text: "机组",
	            nodes: [{
		            text: "发电电量（MWh）"
		        },{
		            text: "上网电量（MWh）"
		        } ,{
		            text: "供电电量（MWh）"
		        } ,{
		            text: "可变运行成本（万元）"
		        } ,{
		            text: "启停费用（万元）"
		        } ,{
		            text: "购电成本（万元）"
		        } ,{
		            text: "机组提供正备用（MW）"
		        }  ,{
		            text: "机组提供负备用（MW）"
		        }
	            ]
	        },
	        {
	            text: "环保统计",
	            nodes: [{
		            text: "二氧化硫（吨）"
		        },{
		            text: "二氧化碳（万吨）"
		        } ,{
		            text: "燃煤（万吨）"
		        } ,{
		            text: "烟尘（吨）"
		        } ,{
		            text: "氮氧化合物（吨）"
		        } ,{
		            text: "灰渣（万吨）"
		        } ,{
		            text: "碳氢化物（万吨）"
		        }  ,{
		            text: "燃气（亿立方米）"
		        }
	            ]
	        } ];
		        var nodeCheckedSilent = false;

		        function nodeChecked(event, node) {
		        	if(node.selectable&&node.nodes==undefined){
		        		
			        	var str = $("#itemText").val();
		                if (str.length > 0) {
		                	if(str.indexOf(node.text)==-1){
			                    $("#itemText").val(str + ',' +node.text);
		                	}
		                } else {
		                    $("#itemText").val(node.text);
		                }
		        	}
		        	
		            if (nodeCheckedSilent) {
		                return;
		            }
		            nodeCheckedSilent = true;
		            checkAllParent(node);
		            checkAllSon(node);
		            nodeCheckedSilent = false;
		        }

		        var nodeUncheckedSilent = false;

		        function nodeUnchecked(event, node) {
					if(node.selectable&&node.nodes==undefined){
		        		
			        	var str = $("#itemText").val();
		                if (str.length > 0) {
		                	if(str.indexOf(node.text)!=-1){
		                		//str = str.replace((node.text+','),'');
			                    $("#itemText").val(resListString(str,node.text));
		                	}
		                } else {
		                    $("#itemText").val('');
		                }
		        	}
		            if (nodeUncheckedSilent)
		                return;
		            nodeUncheckedSilent = true;
		            uncheckAllParent(node);
		            uncheckAllSon(node);
		            nodeUncheckedSilent = false;
		        }

		        //选中全部父节点  
		        function checkAllParent(node) {
		            $('#searchTree').treeview('checkNode', node.nodeId, {
		                silent: true
		            });
		            var parentNode = $('#searchTree').treeview('getParent', node.nodeId);
		            if (!("nodeId" in parentNode)) {
		                return;
		            } else {
		                checkAllParent(parentNode);
		            }
		        }
		        //取消全部父节点  
		        function uncheckAllParent(node) {
		            $('#searchTree').treeview('uncheckNode', node.nodeId, {
		                silent: true
		            });
		            var siblings = $('#searchTree').treeview('getSiblings', node.nodeId);
		            var parentNode = $('#searchTree').treeview('getParent', node.nodeId);
		            if (!("nodeId" in parentNode)) {
		                return;
		            }
		            var isAllUnchecked = true; //是否全部没选中  
		            for (var i in siblings) {
		                if (siblings[i].state.checked) {
		                    isAllUnchecked = false;
		                    break;
		                }
		            }
		            if (isAllUnchecked) {
		                uncheckAllParent(parentNode);
		            }

		        }

		        //级联选中所有子节点  
		        function checkAllSon(node) {
		            $('#searchTree').treeview('checkNode', node.nodeId, {
		                silent: true
		            });
		            if (node.nodes != null && node.nodes.length > 0) {
		                for (var i in node.nodes) {
		                    checkAllSon(node.nodes[i]);
		                }
		            }
		        }
		        //级联取消所有子节点  
		        function uncheckAllSon(node) {
		            $('#searchTree').treeview('uncheckNode', node.nodeId, {
		                silent: true
		            });
		            if (node.nodes != null && node.nodes.length > 0) {
		                for (var i in node.nodes) {
		                    uncheckAllSon(node.nodes[i]);
		                }
		            }
		        }
		        $('#searchTree').treeview({
		            showCheckbox: true,
		            data: treeData,
		            onNodeChecked: nodeChecked,
		            onNodeUnchecked: nodeUnchecked
		        });
			
			
			
		}
		function selectData(){
			$("#table").css("display","block");
			$("#operate").css("display","block");
			$("#iframe").css("display","none");
			var year =  $('#dateID').val(); 
			var planName = $("#knowledgeText").val();
			var itemName = $("#itemText").val();
			if(JyyCommon.isEmpty(year)){
				JyyMsgBox.alert({ title:"警告", message:"[年份]不可为空",type:"warning"}).on(function (e) {});
				return false;
			}
			if(JyyCommon.isEmpty(planName)){
				JyyMsgBox.alert({ title:"警告", message:"[方案名称]不可为空",type:"warning"}).on(function (e) {});
				return false;
			}
			if(JyyCommon.isEmpty(itemName)){
				JyyMsgBox.alert({ title:"警告", message:"[指标名称]不可为空",type:"warning"}).on(function (e) {});
				return false;
			}
			JyyLoading.start();
			$.when(getTableData(year,planName,itemName)).done(function(tableData){
				if(table == null){
					table = JyyTable.init("table", tableData, {position:"absolute",top:"50px",left:"20px",right:"5px",bottom:"0px",overflow:"hidden"});
				}else{
					table.refresh(tableData);
				}
				JyyLoading.end();
			});
		}
		function resListString (l,t){
			var strs= new Array();
			var res ='';
				strs=l.split(",");
			for (var i=0;i<strs.length;i++ ){
				if(strs[i]==t){
					delete strs[i];
					//strs.splice(i,1)
				}
			}
			for (var i=0;i<strs.length;i++ ){
				if(strs[i]!=undefined&&strs[i]!=''){
					res = res + strs[i]+',';
				}
			}
			if(res.endsWith(',')){
				res = res.substr(0,res.length-1);
    		}
			return res;
		}
		  
		//查询
		function select(){
			$('#hideDiv').hide();
			$('#searchTree1').hide();
			selectData();
		}
		//重置
		function reset(){
			$('#hideDiv').hide();
			$('#searchTree1').hide();
			planId = '';
			$("#knowledgeText").val("");
			$("#itemText").val("");
			$("#dateID").val("");
		}
		
		function getTreeDatas(){
			var userId =  this.getQueryString("userId")||'';
			var projectId =  this.getQueryString("projectId")||'';
			if(projectId != '') {
				$("#hideDiv").css("height", "100px");
				$("#hideDiv button").css("top", "150px");
			}
			var result = invoke('getPlantTree', {modelId:'0',projectId:projectId,userId:userId}).data;
			var sts=eval("("+result+")");
			return sts;
		}
		function getQueryString (name){
			var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
			var r = window.location.search.substr(1).match(reg);
			return r ? unescape(r[2]) : null;
		}
		
		
		function getTableData(year,planName,itemName){
			var defer = $.Deferred();
			var result = null;

			/* $.ajax({
				dataType: "json",
				async:true,
				data:{"pagenow":currentPage,"pagenum":pageSize,"keyword":keyword,"projectid":parent.planId},
				url: "../pv/page/pageInfo/"+code
			}).done(function(res) {
				var sts=eval("("+res+")");
				result = sts;
				defer.resolve(sts);
			}); */
			
			result = invoke('selectCompar', {planId:planId,planName:planName,itemName:itemName,year:year}).data;
			var sts=eval("("+result+")");
			defer.resolve(sts);
			
			return defer.promise();
		}
		function invoke(url, args, callback){
			var r, op = {
					url: '../g/service/Sample/' + url,
					type:'POST',
					cache:false,
					async:true,
					dataType:'json',
					data:args ? JSON.stringify(args) : null,
					contentType:"application/json"
				};
			if(typeof callback == 'function'){
				op.success = function(data){
					if(data.error)return alert(data.error);
					callback(data);
				}
			} else {
				op.async = false;
				op.success = function(data){
					r = data
				};
			}
			$.ajax(op);
			if(r)if(r.error){
				alert(r.error);
				return null;
			}
			return r;
		};
	</script>
</head>
<body style="position:absolute;top:0px;left:0px;right:0px;bottom:0px;">
	<div id="operate" style="position: absolute;top: 0px;left: 20px;right: 0px;height: 50px;">
		<div class="col-md-12" style="position: absolute;top: 10px;padding-left: 5px;padding-right: 5px;">
			
			
			<button class="btn btn-info btn-sm" style="float: right;" onclick=reset()>重置</button>
			<button class="btn btn-info btn-sm" style="float: right;margin-right: 5px;" onclick=select()>查询</button>

			<label  class="control-label col-sm-1" style="float: left;margin-top: 7px;padding: 0px;width: 60px;font-weight: normal;" for="txt_search_departmentname">方案名称：</label>
	 		<input type="text" id="knowledgeText" name="knowledgeText" class="form-control" readonly style="float: left;margin-top: -3px;padding: 0px;width: 304px;font-weight: normal;"  onclick="$('#hideDiv').show()" placeholder="方案名称"/>			
		
			<label  class="control-label col-sm-1" style="float: left;margin-top: 7px;margin-left: 21px;padding: 0px;width: 60px;font-weight: normal;" for="txt_search_departmentname">指标名称：</label>
	 		<input type="text"  id="itemText"  class="form-control" readonly style="float: left;margin-top: -3px;padding: 0px;width: 304px;font-weight: normal;"  onclick="$('#searchTree1').show()" placeholder="指标名称"/>			
			
			
			<label  class="control-label col-sm-1" style="float: left;margin-top: 7px;margin-left: 21px;padding: 0px;width: 60px;font-weight: normal;" for="txt_search_departmentname">选择年份：</label>
			<input id="dateID" class="form-control" placeholder="请选择年份" readonly style="float: left;margin-top: -3px;padding: 0px;width: 184px;font-weight: normal;">
			<!-- <div class="btn-group" role="group" style="float: left;margin-top: -3px;padding: 0px;width: 304px;font-weight: normal;" >
			    <select id='sel' class="selectpicker"   >
				                              
				</select>
	  		</div> -->
		
		</div>
	</div>
	<div id="searchTree1" style="display: none;position: absolute; inset: 50px 5px 0px 470px; overflow: auto;z-index: 99999;width: 304px;height: 235px;background: white;">
	    <div id="searchTree"></div>
	    <button class="btn" type="button" onclick="$('#searchTree1').hide()" style="margin: -17px 0px 0px 213px;border: 1px solid #317cce;color: #317cce;background-color: #eaf8f4;position: fixed;top: 305px;">
	        <span class="glyphicon glyphicon-eye-open"></span> 确定
	    </button>
	</div>
	<div id="hideDiv" style="display: none;position: absolute; inset: 50px 5px 0px 85px; overflow: auto;z-index: 99999;width: 304px;height: 235px;background: white;">
	    <div id="knowledgeTree"></div>
	    <button class="btn" type="button" onclick="$('#hideDiv').hide()" style="margin: -17px 0px 0px 213px;border: 1px solid #317cce;color: #317cce;background-color: #eaf8f4;position: fixed;top: 305px;">
	        <span class="glyphicon glyphicon-eye-open"></span> 确定
	    </button>
	</div>
	<div id="table"></div>
	<div id="iframe" style="position: absolute;top: 0px;left: 20px;right: 0px;height: 820px;display:none">
		<iframe  frameborder="0" width="100%" scrolling="No" height="100%" leftmargin="0" topmargin="0" id="sampleIframe"></iframe>
	</div>
</body>
</html>